<template>
  <div style="margin: 10px">
    <el-row class="bottom-space">
      <el-page-header content="新建任务" @back="goBack"></el-page-header>
    </el-row>
    <el-row class="bottom-space">
      <el-col :offset="2" :span="20">
        <el-steps :active="step" finish-status="success">
          <el-step title="基本信息"></el-step>
          <el-step title="新增子任务"></el-step>
          <el-step title="分配编辑和编审"></el-step>
          <el-step title="确认提交"></el-step>
        </el-steps>
      </el-col>
    </el-row>
    <el-row v-if="step === 0">
      <BasicInfo v-model="task.basicInfo"></BasicInfo>
    </el-row>
    <el-row v-if="step === 1">
      <SubTask v-model="task.subTask" :knowledgeLibId="task.basicInfo.lib"></SubTask>
    </el-row>
    <el-row v-if="step === 2">
      <TaskItemList :height="taskItemListHeight" :auditLevel_bak="task.basicInfo.reviewLevel"
                    :knowledge-lib-id="task.basicInfo.lib" :task-item-list="task.subTask"/>
    </el-row>
    <el-row v-if="step === 3">
      <TaskDetail :style="{height: CONST.WORKSPACE_HEIGHT - 150 + 'px'}" :task="task"></TaskDetail>
    </el-row>
    <el-row>
      <el-col :span="10">
        <el-button v-if="step === 0" size="small" @click="cancel">取消</el-button>
        <el-button v-if="step > 0 && step < 4" size="small" @click="previous">上一步</el-button>
        <el-button v-if="step < 3" size="small" type="primary" @click="next">下一步</el-button>
        <el-button v-if="step === 3" size="small" type="primary" @click="submit">提交任务</el-button>
      </el-col>
    </el-row>
  </div>
</template>

<script>
import BasicInfo from "./BasicInfo";
import SubTask from "./SubTask";
import TaskDetail from "../taskDetail/TaskDetail";
import AssignEditorDialog from "../AssignEditorDialog";
import TaskItemList from "../TaskItemList";

export default {
  name: "NewTask",
  components: {TaskItemList, AssignEditorDialog, TaskDetail, SubTask, BasicInfo},
  data() {
    return {
      step: 0,
      task: {
        basicInfo: {
          name: "",
          selfAdd: false,
          system: undefined,
          lib: undefined,
          libName: "",
          dateRange: [],
          reviewLevel: 1,
          fileList: [],
          comment: ""
        },
        subTask: []
      },
      taskItemListHeight: CONST.WORKSPACE_HEIGHT - 100
    }
  },
  methods: {
    goBack() {
      this.$router.back()
    },
    cancel() {
      this.goBack()
    },
    next() {
      if (this.allRequiredItemsAreFilled()) {
        this.step++
      } else {
        this.$message.warning("存在未填写的必填项")
      }
    },
    previous() {
      this.step--
    },
    submit() {
      let param = new URLSearchParams()
      param.append("task", JSON.stringify(this.task))
      this.axios.post("/pmph/action/task/submit", param).then(() => {
        this.step++
        this.goBack()
      })
    },
    allRequiredItemsAreFilled() {
      if (this.task.basicInfo.name === undefined || this.task.basicInfo.name === "") {
        return false
      } else if (this.task.basicInfo.system === undefined) {
        return false
      } else if (this.task.basicInfo.lib === undefined) {
        return false
      } else if (this.task.basicInfo.dateRange === null || this.task.basicInfo.dateRange.length === 0) {
        return false
      }
      return true
    }
  },
}
</script>

<style scoped>
.bottom-space {
  margin-bottom: 10px;
}
</style>
